<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="qq">我爱你中国</div>
    <script>
        /* 
            getElementById() 返回一个匹配特定 ID的元素.
            语法：var element = document.getElementById(id);
            document 是一个对象
            getElementById()  是对象的方法
            qq 是方法的实参
            返回值 是这个元素，如果不存在返回 null
            div 是变量，保存返回值

            输入 处理 输出

            css 样式  class
        */
        var div = document.getElementById("qq");
        console.log(div);
        // div 也是一个对象
        // dir() 可以查看对象的属性和方法
        console.log(div);
    </script>
</body>
</html>